<style lang="less" scoped src="./appeal.less"></style>
<script src="./appeal.js"></script>

<template>
    <div>
        <Row style="font-size: 15px;">
            <Col span="24">
            主题名称：<Input v-model="query.themeName" clearable style="width: 15%"></Input>
            奖项名称：<Input v-model="query.dipName" clearable style="width: 15%"></Input>
            申诉状态：<Select v-model="query.status" style="width:100px">
                        <Option value=" ">全部</Option>
                        <Option value="0">待处理</Option>
                        <Option value="1">已处理</Option>
                        <Option value="2">已撤销</Option>
                    </Select>
            <span @click="loadList"><Button type="primary" icon="android-search">查询</Button></span>
            <span @click="refresh"><Button type="primary" icon="refresh">重置</Button></span>
            </Col>
        </Row>
        <div class="main-table">
            <Table border :columns="columns" :data="data"></Table>
        </div>
        <div class="pagination">
            <Page :total="total" size="small" :page-size="pageSize" :current.sync="pageIndex" @on-change="loadList"
                  show-total show-elevator></Page>
        </div>

        <Modal
                v-model="detailModal"
                title="奖状申诉"
                width="40%"
                :mask-closable="false">
            <Form :model="formData" :label-width="80">
                <FormItem label="申诉原因">
                    <Input v-model="formData.remark" type="textarea" :autosize="{minRows: 5,maxRows: 5}" :readonly="true"></Input>
                </FormItem>
                <FormItem label="处理结果">
                    <Input v-model="formData.reply" type="textarea" :autosize="{minRows: 5,maxRows: 5}"></Input>
                </FormItem>
            </Form>
            <div slot="footer">
                <Button type="primary" @click="save">保存</Button>
                <Button type="ghost" style="margin-left: 8px" @click="detailModal = false">取消</Button>
            </div>
        </Modal>
    </div>
</template>